<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
	
<div id="courseTreegrid"></div>
<div id="courseToolbar">
	<div>
		<a href="#" class="easyui-linkbutton" onclick="course.toolbar.showAddDialog();" data-options="
		iconCls:'icon-add',
		plain:true">
			新增
		</a>
		<a href="#" class="easyui-linkbutton" onclick="course.toolbar.showUpdateDialog();" data-options="
		iconCls:'icon-edit',
		plain:true">
			修改
		</a>
		<a href="#" class="easyui-linkbutton" onclick="course.toolbar.remove();" data-options="
		iconCls:'icon-remove',
		plain:true">
			删除
		</a>
		<a href="#" class="easyui-linkbutton" onclick="course.toolbar.redo();" data-options="
		iconCls:'icon-redo',
		plain:true">
			取消
		</a>
	</div>
	<div>
		<strong>课程名称：</strong>
		<input type="text" name="name" id="searchName" class="easyui-textbox"/>
		<strong>状态：</strong>
		<select name="state" id="searchState" class="easyui-combobox" style="width:100px;height:23px">
			<option value="">全部</option>
			<option value="1">有效</option>
			<option value="2">无效</option>
		</select>
		<strong>创建时间：</strong>
		<input type="text" name="operateTime" id="searchTime" class="easyui-datetimebox"/>
		<a href="#" onclick="course.toolbar.search()" class="easyui-linkbutton" data-options="
		iconCls:'icon-search',
		plain:true">
			查询
		</a>
	</div>
</div>

<div id="courseAddDialog" style="width:320px" class="easyui-dialog course-add" data-options="
title:'新增课程',
buttons:'#courseAddButtons',
closed: true,
onClose:course.toolbar.resetAddFrom">
	<form id="courseAddForm" method="post">
			<p style="margin-top:10px">
				<strong>课程名称:</strong>
				<input type="text" name="name" class="easyui-textbox" style="width:80%;height:30px" data-options="
				required: true">
			</p>
			<p style="margin-top:10px">
				<strong>上级名称:</strong>
				<input type="text" id="menu" name="menu" class="easyui-combobox" style="width:80%;height:30px">
			</p>
			<input type="hidden" name="operateUserId" value="${sysUser.id}">
			<input type="hidden" name="state" value="1">
			<p style="margin-top:10px">
				<!-- <strong>备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注:</strong> -->
				<input type="hidden" name="memo">
			</p>
	</form>
</div>
<div  id="courseAddButtons" style="margin-top:5px">
	<a href="#" onclick="course.toolbar.add()" class="easyui-linkbutton" style="width:30%;height:30px;margin-right:50px" data-options="
	iconCls:'icon-ok',
	plain: true">新增</a>
	<a href="#" onclick="course.toolbar.hiddenAddDialog()" class="easyui-linkbutton" style="width:30%;height:30px;margin-right:10px" data-options="
	iconCls:'icon-redo',
	plain: true">取消</a>
</div>

<div id="courseUpdateDialog" style="width:320px;" class="easyui-dialog classManager-add" data-options="
title: '修改课程信息',
buttons: '#courseUpdateButtons',
closed: true,
onClose: course.toolbar.resetUpdateFrom">
	<form id="courseUpdateForm" method="post">
			<input type="hidden" name="id"/>
			<p style="margin-top:10px">
				<strong>课程名称:</strong>
				<input type="text" name="name" class="easyui-textbox" style="width:80%;height:30px" data-options="
				required: true">
			</p>
			<p style="margin-top:10px">
				<strong>上级名称:</strong>
				<input type="text" name="name" class="easyui-combobox" style="width:80%;height:30px">
			</p>
			<p style="margin-top:10px">
				<strong>状&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;态:</strong>
				<select name="state" class="easyui-combobox" style="width:80%;height:30px">
					  <option value="1">有效</option>
					  <option value="2">无效</option>
				</select>
			</p>
			<p style="margin-top:10px">
				<!-- <strong>备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注:</strong> -->
				<input type="hidden" name="memo">
			</p>
	</form>
</div>
<div id="courseUpdateButtons">
	<a href="#" onclick="course.toolbar.update()" style="width:30%;height:30px;margin-right:50px" class="easyui-linkbutton" data-options="
	iconCls: 'icon-edit',
	plain: true">
		修改
	</a>
	<a href="#" onclick="course.toolbar.hiddenUpdateDialog();" style="width:30%;height:30px;margin-right:10px" class="easyui-linkbutton" data-options="
	iconCls: 'icon-redo',
	plain: true">
		取消
	</a>
</div>

<script>	
	var course = {
		init : function() {
			course.courseTreegrid = $('#courseTreegrid');
			course.courseAddDialog = $('#courseAddDialog');
			course.menu = $('#menu');
			course.courseAddForm = $('#courseAddForm');
			course.courseUpdateForm = $('#courseUpdateForm');
			course.courseUpdateDialog = $('#courseUpdateDialog');
			
			course.courseTreegrid.treegrid({
			    url: '<%=request.getContextPath()%>/CourseServlet?command=listMenu',
			    idField:'id',
			    treeField:'name',
			    fixed: true,
			    fitColumns: true,
			    striped: true,
			    rownumbers: true,
			    singleSelect: false,
			    toolbar: '#courseToolbar',
			    columns:[[
					{field:'id', checkbox: true},
					{field:'name', title:'菜单名称', width:100, align:'left'},
					{field:'pidStr', title:'上级名称', width:50, align:'center'},
					{field:'user__name', title:'操作者', width:100, align:'center'},
					{field:'operateTime', title:'操作时间', width:100, align:'center'},
					{field:'stateStr', title: '状态', width:100, align:'center'},
			    ]],
				    onLoadSuccess: function(node, data) {
						$(this).tree('expandAll');
					course.courseTreegrid.treegrid('reload');
				   }
			});
		},
		toolbar: {
			showAddDialog: function() {
				course.menu.combotree({
					url: '<%=request.getContextPath()%>/CourseServlet?command=listMenu',
					lines: true,
					multiple: true,
					checkbox: true,
					onlyLeafCheck: false,
					onLoadSuccess: function(node, data) {
						$(this).tree('expandAll')
					}
				});
				course.courseAddDialog.dialog('open');
			},
			hiddenAddDialog: function() {
				course.courseAddDialog.dialog('close');
				course.toolbar.resetAddForm();
			},
			resetAddForm: function() {
				course.courseAddForm.form('reset');
			},
			add: function() {
				if (course.courseAddForm.form('validate')) {
					$.post('<%=request.getContextPath()%>/CourseServlet?command=addCourse', course.courseAddForm.serialize(), function(data) {
						if (data) {
							$.messager.show({
								title: '系统提示',
								msg: '新增成功！',
								timeout: 3000,
								showType: 'slide'
							});
							course.courseTreegrid.treegrid('reload');
							course.toolbar.hiddenAddDialog();
							course.toolbar.resetAddFrom();
						} else {
							$.messager.alert('系统提示', '新增失败！', 'error')
						}
						course.toolbar.hiddenAddDialog();
					});
				}
			},
			showUpdateDialog: function(id) {
				var getData = function(v) {
					$.post('<%=request.getContextPath()%>/CourseServlet?command=getCourse', {id : v}, function(data) {
						if (data) {
							course.courseUpdateForm.form('load', {
								id: data.id,
								name: data.name,
								pid: data.pid,
								state: data.state,
							});
							course.courseUpdateDialog.dialog('open');
						} else {
							$.messager.alert('系统提示', '获取信息失败！', 'error')
						}
						$.messager.progress('close');
					}, 'json');
				}
				if (id) {
					getData(id);
				} else {
					var row = course.courseTreegrid.datagrid('getSelections');
					if (row.length == 1) {
						getData(row[0].id);
					} else {
						$.messager.show({
							title: '系统提示',
							msg: '请选择一行数据进行修改！',
							timeout: 3000,
							showType: 'slide'
						});	
					}
				}
			},
			hiddenUpdateDialog: function() {
				course.courseUpdateDialog.dialog('close');
				course.toolbar.resetUpdateFrom();
			},
			resetUpdateFrom: function() {
				course.courseUpdateForm.form('reset');
			},
			update: function() {
				if (course.courseUpdateForm.form('validate')) {
					$.post('<%=request.getContextPath()%>/CourseServlet?command=updateCourse', $("#courseUpdateForm").serialize(), function(data) {
						if (data == 1) {
							$.messager.show({
								title: '系统提示',
								msg: '修改成功！',
								timeout: 3000,
								showType: 'slide'
							});
							course.toolbar.resetUpdateFrom();
							course.courseTreegrid.treegrid('reload');
						} else {
							$.messager.alert('系统提示', '修改失败！', 'error');
						}
						
						course.toolbar.hiddenUpdateDialog();
					});
				}
			},
			remove: function() {
				var row = course.courseTreegrid.datagrid('getSelections');
				if (row.length > 0) {
					var ids = [];
					$.each(row, function(i, v) {
						ids.push(v.id);
					});
					$.post('<%=request.getContextPath()%>/CourseServlet?command=deleteCourse', {ids: ids.join(',')}, function(data) {
						if (data == 1) {
							$.messager.show({
								title: '系统提示',
								msg: '删除成功！',
								timeout: 3000,
								showType: 'slide'
							});
							course.courseTreegrid.treegrid('reload');
						} else {
							$.messager.alert('系统提示', '删除失败！', 'error')
						}
						$.messager.progress('close');
					});
				} else {
					$.messager.show({
						title: '系统提示',
						msg: '请选择数据进行删除！',
						timeout: 3000,
						showType: 'slide'
					});	
				}
			},
			redo: function() {
				course.courseTreegrid.datagrid('unselectAll');
			},
			search: function() {
				course.courseTreegrid.treegrid('load', {
					name: course.courseSearchName.val(),
					//state: classManager.classManagerSearcState.val(),
					//operateTime: classManager.classManagerSearchTime.val()
				});
			}
		},
	};
	
	$(function(){
		course.init();
	});
</script>
